import React from 'react'
import { Link, NavLink } from 'react-router-dom'

export const Menu = () => {
  return (
    <div>
        <ul>
            <li>
                {/* 
                    在router中使用a标签来创建超链接，会发送请求，因此在router中不要用a标签
                    
                    使用Link来创建超链接
                    使用NavLink可以使用激活样式
                */}
                {/* <a href='/'>主页</a> */}
                <Link to="/">主页</Link>
            </li>
            <li>
                {/* <a href='/about'>关于</a> */}
                <NavLink to="/about">关于</NavLink>
            </li>
            <li>
                <NavLink to="/student/1">学生</NavLink>
            </li>
        </ul>
    </div>
  )
}
